import React, { Component } from 'react';
import { StyleSheet, View, TouchableOpacity, Text, Image, Alert } from 'react-native';
import { FormItem } from '../../../../components/form/formItem';
import { GLOBAL } from '../../../../config/global';
import HTTP from '../../../../utils/http';
import { API, API_GENERATE } from '../../../../config/api';
import { Common } from '../../../../component/common/Common.js'

const checkOnImg = require('../../../../imgs/checkOn.png');
const checkOffImg = require('../../../../imgs/checkOff.png');
const scale = GLOBAL.SCALE;
/*
 参数:data
	rebateId : 优惠ID
	rebatePrice : 是否勾选使用  
参数 :params
	companyId,
	goodsId,
	priceType
参数:
	callBack : 回调
*/


export class SelectOnffBlock extends Component {
	constructor(props) {
		super(props);
		let { checkRebateFlag } = props.data || {};
		this.state = {
			checkRebateFlag,
			rebatePriceData: {},
			radioVisible: false,
			radioIndex: -1
		}
		this._getData();

	}


	/* 	componentWillMount() {
		} */

	componentWillReceiveProps(props) {
		console.log('走走走走走几次', props);
		this._getData();
	}

	/* shouldComponentUpdate = (nextProps) => {
		console.log("this.props", this.props, nextProps)
		if (Utils.deepCompare(this.props, nextProps)) return false;
		return true;
	} */


	_getData = async () => {
		console.log("this.props.params---111", this.props);
		let { callBack, params, data } = this.props || {};
		let { companyId, goodsId, priceType } = params || {};
		let { checkRebateFlag, rebateId } = data || {};
		if (!companyId || !goodsId || !priceType) {
			callBack && callBack({ checkRebateFlag: null, rebateListItem: null, isPromotion: null });
			return;
		}
		// 排除长约id
		if (params.tCode != "E" && params.tCode != "QH") {
			delete params.longOrderId;
		}
		let respose = await HTTP.POST(API_GENERATE(API.ORDER_REBATE_PRICE), params);
		console.log("respose-123", respose)

		if (JSON.stringify(respose) == "{}") {
			//不使用 清空一下 防止老数据问题
			callBack && callBack({ checkRebateFlag: null, rebateListItem: null, isPromotion: null });
			return;
		}


		//状态 赋值
		this.isPromotion = respose.isPromotion;

		//不使用排除
		if (this.isPromotion === 2) {
			//不使用 清空一下 防止老数据问题
			callBack && callBack({ checkRebateFlag: true, rebateListItem: null, isPromotion: this.isPromotion });
			return null;
		}


		if (respose && respose.rebateList) {
			let iLength = respose.rebateList.length;
			this._modifyData(respose);
			this.setState({
				rebatePriceData: respose,
				radioIndex: iLength > 1 ? this._getIndex(respose.rebateList, rebateId) : 0,
				checkRebateFlag: checkRebateFlag || false // 前面一个(checkRebateFlag) 草稿回显用
			}, () => {
				console.log("你进来了没", this.isPromotion)
				callBack && callBack({ checkRebateFlag: this.state.checkRebateFlag, rebateListItem: (this.state.radioIndex != -1 ? respose.rebateList[this.state.radioIndex] : null), isPromotion: this.isPromotion });
			})
		}

	}

	_getIndex = (rebateList, rebateId) => {
		let resultNum = -1;
		if (rebateList.length) {
			rebateList.forEach((item, index) => {
				if (item.rebateId == rebateId) {
					resultNum = index;
				}
			})
		}
		return resultNum;
	}

	_modifyData = (respose) => {
		if (respose && respose.rebateList) {
			respose.rebateList.map(item => {
				item.dictName = `${item.regionName} ${item.rebatePrice}元/吨`;
				return item;
			})
		}
		return respose;
	}

	_selectFn = () => {
		let { callBack } = this.props || {};
		let { checkRebateFlag, rebatePriceData, radioIndex } = this.state;
		let { rebateList } = rebatePriceData || {};

		if (!checkRebateFlag) {
			Alert.alert('提示', `勾选不使用,本单合同价将不计算客户优惠,请确认`, [
				{
					text: '确认', onPress: () => {
						this.setState({ checkRebateFlag: !checkRebateFlag }, () => {
							console.log("this.state.checkRebateFlag", this.state.checkRebateFlag)
							callBack && callBack({ checkRebateFlag: this.state.checkRebateFlag, rebateListItem: rebateList[radioIndex], isPromotion: this.isPromotion });
						})
					}
				},
				{
					text: '取消', onPress: () => {
						console.log("取消");
					}
				}
			]);
		} else {
			this.setState({ checkRebateFlag: !checkRebateFlag }, () => {
				callBack && callBack({ checkRebateFlag: this.state.checkRebateFlag, rebateListItem: rebateList[radioIndex], isPromotion: this.isPromotion });
			})
		}



	}

	_openSelect = () => {
		this.setState({
			radioVisible: true
		})
	}

	_renInput = () => {
		let { checkRebateFlag, rebatePriceData, radioIndex } = this.state || {};
		let { rebateList } = rebatePriceData || {};
		let morePrice = radioIndex > -1 ? rebateList[radioIndex].rebatePrice : null;
		let moreLabel = radioIndex > -1 ? `客户优惠(${rebateList[radioIndex].regionName})` : '客户优惠';

		if (!checkRebateFlag && rebateList) {
			if (rebateList.length === 1) {
				return <FormItem required type={'input'} editable={false} label={`客户优惠(${rebateList[0].regionName})`} value={rebateList[0].rebatePrice} border rightText={"元/吨"} />
			} else if (rebateList.length > 1) {
				return <FormItem required type={'select'} label={moreLabel} placeHolder={'请选择优惠'} value={morePrice} border handleCallBack={this._openSelect} required rightText={"元/吨"} />
			} else {
				return null;
			}
		}
		return null;
	}

	//弹框选择回调
	_radioCallBack = (radioIndex) => {
		let { callBack } = this.props || {};
		let { rebatePriceData } = this.state || {};
		let { rebateList } = rebatePriceData || {};
		this.setState({
			radioIndex,
			radioVisible: false
		}, () => {
			callBack && callBack({ checkRebateFlag: this.state.checkRebateFlag, rebateListItem: rebateList[radioIndex], isPromotion: this.isPromotion });
		})
	}


	render() {
		let { checkRebateFlag, rebatePriceData, radioVisible, radioIndex } = this.state || {};
		let { rebateList } = rebatePriceData || {};
		console.log("组件渲染", this.isPromotion, this.state)
		return (
			<View>
				{
					/*  isPromotion 
							0; // 可使用
							1; // 必须使用
							2; // 不能使用 
					 */
					(this.isPromotion == 2 || this.isPromotion === undefined) ? null : (<View>
						{this._renInput()}
						{
							this.isPromotion == 0 ? <TouchableOpacity activeOpacity={.6} style={styles.selectWrap} onPress={() => { this._selectFn() }}>
								<Image style={{ marginRight: 4 * scale }} source={checkRebateFlag ? checkOnImg : checkOffImg} />
								<Text style={{ opacity: 1 }}>不使用客户优惠</Text>
							</TouchableOpacity> : null
						}
					</View>)
				}

				<Common type="modal" demoData={(
					<Common type="listRadio" selectIndex={radioIndex} title={'请选择优惠'} listData={rebateList || []} selectCallBack={this._radioCallBack} />
				)} isVisible={radioVisible} closeCallballFn={() => { this.setState({ radioVisible: false }) }} />
			</View>
		)
	}
}

const styles = StyleSheet.create({
	selectWrap: {
		flexDirection: 'row',
		alignItems: 'center',
		justifyContent: 'flex-end',
		paddingTop: 14 * scale,
		paddingBottom: 14 * scale,
		marginRight: 24.5 * scale,
	}

})

